❓질문

자바스크립트에서 어떻게 호이스팅이 가능한지에 대해 설명해주세요

💡 조사하기전 내가 알고 있던 내용

대답을 하지 못했습니다.

🏫 정리한 내용

자바스크립트에서 호이스팅이 가능한 이유는 자바스크립트 엔진이 코드를 실행하기 까지 두 단계의 과정을 거치기 때문입니다.

이 두 단계는 컴파일 단계와 실행 단계이며, 이 과정에서 호이스팅이 발생하게 됩니다. 구체적으로 말씀드려보겠습니다.

첫번쨰로 컴파일 단계입니다.

자바스크립트 엔진은 스크립트를 실행하기 전에 먼저 컴파일 단계를 거칩니다. 이 과정에서 함수 및 변수 선언을 한 부분이 메모리에 할당됩니다. 이때 변수와 함수 선언을 미리 메모리에 올려두기 때문에 실제 코드에서 선언된 위치보다 앞에서 접근이 가능해지는 것입니다.

let, const 가 아닌 var를 통해 선언되면, 컴파일 단계에서 변수가 메모리에 올라가며, 이때 값은 undefined로 초기화됩니다. 이후 실행 단계에서 코드가 진행되면서 실제 할당된 값이 대입됩니다.

console.log(myVar) // undefined
var myVar = 5;
console.log(myVar) // 5

위의 예시에서 myVar 변수 선언이 코드 최상단으로 "호이스팅"되어 컴파일 단계에서 메모리에 먼저 올라가고, 초기값은 undefined로 설정됩니다.

따라서 console.log(myVar)의 첫 번째 출력에서 undefined가 나오는 것입니다.

두번째는 실행 단계입니다.

실행 단계란 실제 코드가 실행되는 과정으로, 컴파일 단계에서 메모리에 할당된 변수와 함수가 실행됩니다. 여기서 변수가 할당된 값을 가지게 되고, 함수가 호출되면 그 안의 코드가 수행됩니다.

정리해서 말씀 드리겠습니다. 자바스크립트에서 호이스팅이 가능한 이유는 자바스크립트 엔진이 코드를 단순히 한 줄씩 실행 하지않고, 먼저 컴파일 단계에서 코드를 파악하고 필요한 메모리를 확보하는 과정을 거치기 때문입니다.

이를 통해 코드내에서 선언 위치와 상관없이 변수를 사용할 수 있는 유연성을 제공합니다.